<div class="flex-col">
    <div class="page-info-text loading-xpra-indicator" [ngStyle]="{'z-index': NoVNCClientReady ? '-99': '0'}">
        <div *ngIf="!DesktopRequested" class="flex-col disconnected-msg">
            <span>Desktop</span>
            <div class="reconnect-button" (click)="requestDesktop()">
                <span>Start</span>
            </div>
        </div>
        <span *ngIf="DesktopRequested && !NoVNCClientReady">
            Loading NoVNC Client...
        </span>
    </div>
    <div class="share-overlay flex-col" *ngIf="DesktopRequested&&NoVNCClientReady" (click)="openShareDialog()">
        <img src="../../../assets/icons/share.svg" alt="share" class="share-desktop-icon">
    </div>
    <iframe id="DesktopFrame" *ngIf="DesktopRequested" [ngStyle]="{'z-index': !NoVNCClientReady ? '-99': '0'}"
        (load)="stateChange()" class="desktop-view" [src]="IframeURL" frameborder="0">
    </iframe>
</div>